<template>
  <div class="LogSearchExpand" id="LogSearchExpand">
    <span class="LogSearchTimeModel" v-if="!startTime">
      {{this.tableList[0]?timeFormatter({TIME:this.tableList[0].TIME}) : ''}}
    </span>
    <span class="LogSearchTimeModel" v-else>
      {{this.endTime?$t('开始会话时间:'):''}}{{this.startTime?timeFormatter({TIME:this.startTime}):''}}
      {{(this.startTime && this.endTime)?',':''}}
      {{(this.endTime)?($t('会话结束时间:') + timeFormatter({TIME:this.endTime})):''}}
      {{(this.startTime && this.endTime)?($t('，会话时常:') + timeToFormatter(this.startTime, this.endTime)):''}}
    </span>
    <el-table @sort-change='sortChange' ref="multipleTable" size='mini' :data="tableList" tooltip-effect="dark" v-loading="loading" style="width: 100%">
      <el-table-column prop="TIME" align='center' sortable='custom' :label="$t('时间')" :formatter="timeFormatter" min-width="150"></el-table-column>
      <el-table-column prop="MODE" align='center' :label="$t('模块')" min-width="120">
        <template slot-scope="scope">
          {{ $t(modeList[scope.row.MODE]) || '' }}
        </template>
      </el-table-column>
      <el-table-column prop="LEVEL" align='center' sortable='custom' :label="$t('级别')" min-width="80">
        <template slot-scope="scope">
          {{ levelList[scope.row.LEVEL] || '' }}
        </template>
      </el-table-column>
      <el-table-column prop="MSG" align='center' :label="$t('信息')" min-width="200">
        <template slot-scope="scope">
          <tooltip :copyText="scope.row.MSG" class="wid190">
          </tooltip>
        </template>
      </el-table-column>
      <el-table-column prop="SIP" align='center' :label="$t('源地址')" min-width="120">
        <template slot-scope="scope">
          <tooltip :copyText="scope.row.SIP" class="wid190">
          </tooltip>
        </template>
      </el-table-column>
      <el-table-column prop="DIP" align='center' :label="$t('目的地址')" min-width="120">
        <template slot-scope="scope">
          <tooltip :copyText="scope.row.DIP" class="wid190">
          </tooltip>
        </template>
      </el-table-column>
      <el-table-column prop="SPORT" align='center' :label="$t('源端口')" min-width="100"></el-table-column>
      <el-table-column prop="DPORT" align='center' :label="$t('目的端口')" min-width="100"></el-table-column>
      <el-table-column prop="L4TYPE" align='center' :label="$t('协议类型')" min-width="100"></el-table-column>
      <el-table-column prop="EVENT_TYPE" align='center' :label="$t('事件类型')" min-width="100">
        <template slot-scope="scope">
          <tooltip :copyText="scope.row.EVENT_TYPE" class="wid190">
          </tooltip>
        </template>
      </el-table-column>
      <el-table-column prop="EVENT_ACTION" align='center' :label="$t('事件动作')" min-width="100">
        <template slot-scope="scope">
          {{ scope.row.EVENT_ACTION?$t('eventaction.'+scope.row.EVENT_ACTION):scope.row.EVENT_ACTION }}
        </template>
      </el-table-column>
    </el-table>
    <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page.sync="record.page" :page-size="record.limit" layout="total, sizes, prev, pager, next, jumper" :total="total">
    </el-pagination>
  </div>
</template>

<script>
import { sessionChild } from '@/api/system/logData'
import { Loading } from 'element-ui'
import moment from 'moment'
export default {
  props: ['row', 'logRecord'],
  name: 'LogRecordExpand',
  data () {
    return {
      record: {
        TIME: '',
        SIP: '',
        DIP: '',
        SPORT: '',
        DPORT: '',
        page: 1,
        limit: 20,
        mode: '',
        eventType: '',
        eventAction: ''
      },
      endTime: null,
      startTime: null,
      loading: false,
      total: 0,
      loadingInstance: null,
      tableList: [],
      modeList: {
        // 'AccessControl_dp': '访问控制',
        // 'attack_defense_dp': '异常报文攻击防御',
        // 'ddos_defense_dp': 'FLOOD攻击检测',
        // 'av_policy_dp': '病毒检测',
        // 'ips_policy_dp': '入侵检测',
        // 'snat_dp': '源地址转换',
        // 'dnat_dp': '目的地址转换',
        'url_policy_dp': 'URL策略',
        // 'url_filter_dp': 'URL过滤',
        // 'content_filter_dp': '深度过滤',
        // 'mgmt_defense_dp': '自身防护',
        'mgmt_log': '管理日志',
        'log': '日志查询',
        'log_setting': '日志管理',
        'addr_object': '地址对象',
        'service_object': '服务对象',
        'Vlan': '接口管理',
        'route_policy': '策略路由',
        'route_static': '静态路由',
        'alg': 'ALG',
        'app_id': '应用识别',
        'AccessControl': '访问控制',
        'AccessControl_dp': '访问控制',
        'admin': '管理员配置',
        'attack_defense': '异常报文攻击防御',
        'attack_defense_dp': '异常报文攻击防御',
        'ddos_defense': 'FLOOD攻击防御',
        'ddos_defense_dp': 'FLOOD攻击防御',
        'av_policy': '病毒策略',
        'av_policy_dp': '病毒过滤',
        'bypass': 'BYPASS',
        'config_assist': '辅助配置',
        'content_filter': '深度过滤策略',
        'content_filter_dp': '深度过滤',
        'ha': '双机热备',
        'ip_mac': 'IP-MAC绑定',
        'ip_mac_dp': 'IP-MAC绑定',
        'ips_policy': '入侵防御',
        'ips_policy_dp': '入侵防御',
        'ipv6_tunnel': 'IPv6隧道',
        'nat64': 'NAT64',
        'nat46': 'NAT46',
        'snat': 'SNAT',
        'snat_dp': 'SNAT',
        'dnat': 'DNAT',
        'dnat_dp': 'DNAT',
        'qos': '带宽管理',
        'run_mode': '运行模式',
        'run_mode_dp': '测试模式',
        'session': '连接管理',
        'session_control': '连接控制',
        'statistic_flow': '流量统计',
        'statistic_flow_dp': '流量统计',
        'sysconf': '配置管理',
        'sys_manager': '设备管理',
        'time_object': '时间对象',
        'safe_zone': '安全区域',
        'upgrade': '系统升级',
        'url_class': 'URL分类',
        'url_policy': 'URL策略',
        'url_filter_dp': 'URL过滤',
        'user_auth': '用户认证',
        'main_page': '首页',
        'mgmt_defense': '自身防护',
        'mgmt_defense_dp': '自身防护',
        'cli': '命令行',
        'get_deinfo': '获取调试信息',
        'app_object': '应用对象',
        'mac': '表项管理',
        'keyword_object': '关键字对象',
        'flow_stats': '流量分析',
        'monitor2alarm': '告警模块',
        'ipsec_vpn': 'IPSEC_VPN',
        'debug': '调试诊断',
        'l2tp_pptp': 'L2TP_PPTP',
        'multicast_route': '组播路由',
        'multicast_group': '组播组',
        'radvd': 'IPV6路由通告',
        'project_import': '组态工程导入',
        'interface_collaboration': '接口联动',
        'responsible_object': '责任人对象',
        'asset_object': '资产对象'
      },
      levelList: {
        1: 'ERROR',
        2: 'ALERT',
        3: 'INFO',
        4: 'DEBUG'
      },
      eventActionList: {
        'DROP': '丢弃',
        'REJECT': '拒绝',
        'SE': '安全引擎',
        'ACCEPT': '允许',
        'ALERT': '告警',
        'RESET': '阻断',
        'RateLimit DROP': '限速丢弃',
        'BlackList DROP': '黑名单丢弃',
        'SNAT': '源地址转换',
        'DNAT': '目的地址转换'
      },
      sortList: {
        'descending': 'desc',
        'ascending': 'asc'
      }
    }
  },
  mounted () {
    this.record.TIME = this.row.TIME
    this.record.SIP = this.row.SIP
    this.record.DIP = this.row.DIP
    this.record.SPORT = this.row.SPORT
    this.record.DPORT = this.row.DPORT
    this.record.mode = this.logRecord.mode
    this.record.eventType = this.logRecord.eventType
    this.record.eventAction = this.logRecord.eventAction
    this.record.l4type = this.logRecord.l4type
    this.record.level = this.logRecord.level
    this.tableList = []
    this.startTime = null
    this.endTime = null
    this.total = 0
    this.listData()
  },
  methods: {
    handleSizeChange (val) {
      // console.log(`每页 ${val} 条`)
      this.record.limit = val
      this.record.page = 1
      this.listData()
    },
    handleCurrentChange (val) {
      // console.log(`当前页: ${val}`)
      this.record.page = val
      this.listData()
    },
    changeRecord (data) {
      this.record.mode = data.mode
      this.record.eventType = data.eventType
      this.record.eventAction = data.eventAction
      this.record.l4type = data.l4type
      this.record.level = data.level
    },
    timeFormatter (data) {
      return data.TIME ? moment(new Date(data.TIME * 1000)).format('YYYY-MM-DD HH:mm:ss') : ''
    },
    timeDifFormatter (date) {
      var days = parseInt(date / 86400)
      // 计算小时数
      var remain = date % 86400
      var hours = parseInt(remain / 3600)
      // 计算分钟数
      var remain1 = remain % 3600
      var mins = parseInt(remain1 / 60)
      // 计算秒数
      var secs = remain1 % 60
      var res = days + this.$t('天') + hours + this.$t('小时') + mins + this.$t('分') + secs + this.$t('秒')
      return res
    },
    timeToFormatter (startTime, endTime) {
      if (startTime && endTime) {
        let to = endTime - startTime
        let day = parseInt(to / 60 / 60 / 24)
        let hr = parseInt(to / 60 / 60 % 24)
        let min = parseInt(to / 60 % 60)
        let sec = parseInt(to % 60)
        return day + this.$t('天') + hr + this.$t('小时') + min + this.$t('分钟') + sec + this.$t('秒')
      }
    },
    sortChange (column, prop, order) {
      if (column.order) {
        this.record.FIELD = column.prop
        this.record.ORDERTYPE = this.sortList[column.order]
      } else {
        this.record.FIELD = ''
        this.record.ORDERTYPE = ''
      }
      this.listData()
    },
    listData () {
      if (document.getElementById('LogSearchExpand')) {
        this.loadingInstance = Loading.service({
          target: '#LogSearchExpand',
          lock: true,
          text: this.$t('加载'),
          spinner: 'el-icon-loading',
          background: 'rgba(255, 255, 255, 0.4)'
        })
      }
      sessionChild(this.record).then(res => {
        if (res.status === 0) {
          if (res.info.startTime) {
            this.startTime = res.info.startTime
            this.endTime = res.info.endTime
          } else {
            this.tableList = res.info
            this.total = res.count
          }
        }
        if (this.loadingInstance) {
          this.loadingInstance.close()
          this.loadingInstance = null
        }
      }).catch(e => {
        if (this.loadingInstance) {
          this.loadingInstance.close()
          this.loadingInstance = null
        }
      })
    }
  }
}
</script>
<style lang="less" scoped>
.LogRecordExpand {
  padding: 0px 10px;
  background: #e6e6e6 !important;
}
.LogRecordTimeModel {
  height: 30px;
  line-height: 30px;
  padding-left: 20px;
  color: #ffb800;
  background: white;
}
.LogSearchTimeModel {
  line-height: 36px;
  color: #ffb800;
  background: white;
  font-size: 14px;
  padding: 10px 20px;
}
</style>
